<template>
	<view :style="{ backgroundImage: 'url(' + bgImg + ')' }" class="navbar">
		<image class="back-icon" src="/static/logo.png'" @click="onBack"/>
		<text class="title">{{ title }}</text>
	</view>
</template>
<script>
export default {
	props  : {
		title: String,
		bgImg: {
			type   : String,
			default: '/static/logo.png'
		}
	},
	methods: {
		onBack() {
			uni.navigateBack();
		}
	}
}
</script>
<style lang="scss" scoped>
.navbar {
	height: 88rpx;
	display: flex;
	align-items: center;
	background-size: cover;
	
	.back-icon {
		width: 40rpx;
		height: 40rpx;
		margin-left: 20rpx;
	}
	
	.title {
		flex: 1;
		text-align: center;
		font-size: 36rpx;
		font-weight: bold;
	}
}

</style> 